/**
 * Created by Administrator on 2017/3/21.
 */
import React, {Component} from 'react';
import {
  Form, Input, Radio, Select, Icon,
  Upload, Descriptions, message, Button,
} from 'antd';
import {connect} from 'dva';
import moment from 'moment'
import request from '@/utils/request';
import config from "@/config/config";
const FormItem = Form.Item;
const { TextArea } = Input;
const RadioGroup = Radio.Group;
const Option = Select.Option;
class AddPoliciesForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      fileList:this.props.editRecord?this.props.editRecord.images.map((item,index)=>{
        return {
          uid: item.key,
          name: item.name,
          status: 'done',
          url:item.path,
        }
      }):[],
      all_department:[],
    };
  }
  fetchAllDepartments=()=>{
    const that = this;
    request(`/all_departments`, {
      method: 'GET',
      params: {
        order_direction: 'desc',
      },
    }).then((response) => {
      if (response.status === 200) {
        that.setState({
          all_department: response.data.data,
        });
      }
    });
  }
  componentDidMount() {
    this.fetchAllDepartments();
  }
  render() {
    const formItemLayoutWithLabel = {
      labelCol: {
        xs: {span: 24},
        sm: {span: 6},
      },
      wrapperCol: {
        xs: {span: 24},
        sm: {span: 15},
      }
    };

    const {getFieldDecorator} = this.props.form;
    const props = {
      onRemove: (file) => {
        this.setState(({ fileList }) => {
          const index = fileList.indexOf(file);
          const newFileList = fileList.slice();
          newFileList.splice(index, 1);
          return {
            fileList: newFileList,
          };
        });
      },
      beforeUpload: (file) => {
        if(this.state.fileList.length===3){
          message.error('最多上传三张照片')
          return false
        }
        this.setState(({ fileList }) => ({
          fileList: [...fileList,file],
        }));
        return false;
      },
      fileList: this.state.fileList,
      accept:".png, .jpg, .jpeg"
    };

    return (
      <div>
        <Form>
          <Form.Item label={'水表照片'} {...formItemLayoutWithLabel}>
            <div className="dropbox">
              {getFieldDecorator('file', {
              })(
                <Upload {...props} style={{width:'100%'}}>
                  <Button icon={'upload'}  block={true}>
                    点击选择
                  </Button>
                </Upload>
              )}
            </div>
          </Form.Item>
        </Form>
      </div>
    );
  }
}

const AddPoliciesFormWrap = Form.create()(AddPoliciesForm);
export default connect()(AddPoliciesFormWrap);
